<template>
    <div class="choiceAddress" v-cloak>
    	<div class="addressBox">
	        <van-panel v-for="item in listData" :key="item.id" :title="item.deliveryPerson" :status="item.deliveryPhone" @click.native="$router.replace({name: 'orderBuy', query: {id: $route.query.id, addressId: item.id}})">
			  <div class="choiceAddress_default"><span v-if="item.isDefault" class="choiceAddress_default_active">[默认地址]</span>{{ item | normalizeAddress }}</div>
			</van-panel>
    	</div>
        <van-row class="button-fixed-bottom" @click.native="$router.push({name: 'addressEdit'})">
            <van-button bottom-action>
                <van-icon name="add-o" />
                <i>添加地址</i>
            </van-button>
        </van-row>
    </div>
</template>

<script>
import AddressItem from '@/components/address-item.vue'
import { getAddressList } from '@/api/address/index'

export default {
    components: {
        AddressItem
    },
    data () {
        return {
            loading: false,
            type: 1,
            page: 1,
            listData: [],
        }
	},
	filters: {
		normalizeAddress (item) {
			return item.province + item.city + item.section + item.street_name + item.deliveryAddress
		},
	},
	methods: {
		getAddressData() {
			this.loading = true
			getAddressList(this.type, this.page).then((res) => {
				this.loading = false
				this.listData = res.data.list
			}).catch(() => {
				this.loading = false
				this.listData = []
			})
		}
	},
	created () {
//  	this.getAddressData()
	},
	activated () {
		this.getAddressData()
	},
	
}
</script>

<style lang="scss">
@import "../../styles/color.scss";
[v-cloak] {
    display: none !important;
}
.choiceAddress {
	padding-top:46px ;
	.van-cell{
		padding-bottom: 5px;
	}
    .address-list {
        padding-bottom: 50px;
    }
    .van-cell__value{
    	color: $titleColor;
    }
    .choiceAddress_default{
    	padding: 10px 15px;
    	padding-top: 0;
    	text-align: left;
    	line-height: 24px;
    	.choiceAddress_default_active{
    		color: $checkBoxColor;
    	}
    }
	.van-cell:not(:last-child)::after{
		border: none;
	}
	.addressBox{
		padding-bottom: 50px;
	}
}
</style>
